<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
	#id001{
		background-color:#3C3;
		width:300px;
		height:300px;
		margin:30px;
		padding:20px;
		border:3px solid #099;
		text-align:center;
		
		
		
	}
	#id002{
		background-color:#0FF;
		width:300px;
		height:300px;
		margin:30px;
		padding:20px;
		border:3px solid #903;
		text-align:center;
		border:dotted 10px #003399;
		
	}
	#id003{
		border:none;
	}
	#id004{
		border:groove 3px #006666;
	}
	#id005{
		border:dashed 3px #00FF00;
	}
	#id006{
		border:double 3px #0000FF;
	}
	#id007{
		border: outset 3px #FF99CC;
	}
	#id008{
		border: dotted 3px #006666;
	}
	#id009{
		width:50;
		height:50;
		display:inline-block
	}
	#id0010{
		width:50;
		height:50;
		display:block;
	}
	
	#id011{
		width:700px;
		height:200px;
		background-color:#093;
	
	}
	#id012{
		width:100px;
		height:500px;
		background-color:#C33;
		float:left
	}
	#id013{
		width:700px;
		height:500px;
		background-color:#606;
	}
	
	
	
	
	
  
</style>
</head>

<body>
<div id="id001">盒子模型1</div>
<div id="id002">盒子模型2</div>

<div id="id003">盒子模型3</div>
<div id="id004">盒子模型4</div>
<div id="id005">盒子模型5</div>
<div id="id006">盒子模型6</div>
<div id="id007">盒子模型7</div>
<div id="id008">盒子模型8</div>

<img class="id009" src="file:///C|/盒子模型/img/hhh.jpg" />
<img class="idoo9" src="file:///C|/盒子模型/img/hhh.jpg" />
<img class="id009" src="file:///C|/盒子模型/img/hhh.jpg" />
<img id="id0010" src="file:///C|/盒子模型/img/mht.jpg" />
<img id="id0010" src="file:///C|/盒子模型/img/mht.jpg" />
<img id="id0010" src="file:///C|/盒子模型/img/mht.jpg" />

<div id="id011">aaa</div>
<div id="id012">aaa</div>
<div id="id013">aaa</div>



</body>
</html>
